<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>边框</title>
    <style>
    /*
    边框倒角： border-radius
    边框阴影： box-shadow
    */
        #d1{
            width: 100px;
            height: 100px;
            background: yellow;
            border: 5px dotted black;

            /*border-top-right-radius: 30px;
            border-top-left-radius: 30px;
            border-bottom-right-radius: 30px;
            border-bottom-left-radius: 30px;*/
            border-radius: 20%;
            box-shadow: 100px 100px 50px 50px red ;
        }
        table,td,th{
            border: 1px solid #000;
        }
        table{
            /*
            边框样式，separate:边框分离
                    collapse:边框合并
            */
            border-collapse: separate;

            border-spacing: 10px;
        }
    </style>
</head>
<body>
    <div id="d1">

    </div>
<hr>
<table>
    <tr>
        <th>编号</th>
        <th>书名</th>
        <th>价格</th>
    </tr>
    <tr>
        <td>1</td>
        <td>西游记</td>
        <td>30</td>
    </tr>
    <tr>
        <td>2</td>
        <td>红楼梦</td>
        <td>40</td>
    </tr>
    <tr>
        <td colspan="3">备注:</td>
    </tr>
</table>
</body>
</html>